import { Button } from 'antd';
import { PlusCircleOutlined } from '@ant-design/icons';
import { useContext } from 'react';
import { GlobalShortcutContext } from '../mconfig';
import { IShortcutActionEnum } from '../common';
import { GlobalShortcutKeyAPI } from '../common/type';

export const GlbalShortcutBtn: React.FC<
  GlobalShortcutKeyAPI.IGlbalShortcutBtn
> = () => {
  /**
   * 获取上下文共享数据
   */
  const { shortcutDispatch, shortcutCheckKey, curRes } = useContext(
    GlobalShortcutContext,
  );

  return (
    <>
      {curRes?.['/commonController/editLayout'] && (
        <Button
          type={shortcutCheckKey == 'AddShortcut' ? 'primary' : 'default'}
          icon={<PlusCircleOutlined />}
          key={'AddShortcut'}
          onClick={() => {
            shortcutDispatch({
              type: IShortcutActionEnum.SHORTCUT_CHECKKEY,
              payload: 'AddShortcut',
            });
          }}
          onMouseOut={(event: any) => {
            event?.target?.nodeName == 'BUTTON'
              ? event?.target?.blur()
              : event.target.parentNode.blur();
          }}
        >
          新建
        </Button>
      )}
      {/* <Button
        type={shortcutCheckKey == 'phoneShortcut' ? 'primary' : 'default'}
        icon={<PhoneOutlined />}
        key={'phoneShortcut'}
        onClick={() => {
          shortcutDispatch({
            type: IShortcutActionEnum.SHORTCUT_CHECKKEY,
            payload: 'phoneShortcut',
          });
        }}
      >
        电话
      </Button>
      <Button
        type={shortcutCheckKey == 'mailShortcut' ? 'primary' : 'default'}
        icon={<MailOutlined />}
        key={'mailShortcut'}
        onClick={() => {
          shortcutDispatch({
            type: IShortcutActionEnum.SHORTCUT_CHECKKEY,
            payload: 'mailShortcut',
          });
        }}
      >
        短信
      </Button> */}
    </>
  );
};
